<template>
  <div class="common-body-wrapper">
    <search-header single-width="130" :searchList="searchList" @changeHeight="toRetTable" @confirmSearch="toSearch"
    :isNeedTree="true" :paramName="paramName" @setSelectedNode="setSelectedNode"></search-header>
    <div class="common-table-tree-wrapper">
      <!-- <table-tree :isNeedTree="isNeedTree" :paramName="paramName" @toggleTreeBox="toggleTreeBox" @setSelectedNode="setSelectedNode" @searchFn="getList">
      </table-tree> -->
      <div class="common-table-wrapper">
        <multi-fun-table :sortColumn='notFormatColumn' :orderType='sortType' :fixed-cols="fixedCols" :is-reset-table="isResetTable" :theads-info="theadsInfo" :tbodys-info="tbodysInfo" @handleMultiCheck="handleMultiCheck" @handleSortColumn="handleSortColumn" @searchFn="getList" @getNextPage="getNextPage">
          <!--按钮-->
          <div class="operate-btn-group" slot="operateBtnGroup">
            <a class="ake_btn ake_btn_text" v-if="isPermmited('PARKVIP:VIPWATER:EXPORT')" @click.prevent="exportWater()">导出</a>
          </div>

          <!--普通列-->
          <template slot="tdCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" :min-width="props.minWidth" :width="props.width" :prop="props.prop" :sortable="props.sortable">
              <template slot-scope="scope">
                <span v-if="'reno' == props.prop">{{ scope.$index +1}}</span>
                <span v-else-if="'originPrice' == props.prop">{{ scope.row.originPrice |formatMoney }}</span>
                <span v-else-if="'discountPrice' == props.prop">{{ scope.row.discountPrice |formatMoney }}</span>
                <span v-else-if="'refundPrice' == props.prop">{{ scope.row.refundPrice |formatMoney }}</span>
                <span v-else :title="scope.row[props.prop]">{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>
  
        </multi-fun-table>
  
        <!---->
        <table-pagination :size="total" :cur-page="pageNumber" @backData="getPagination"></table-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import common from '@mixins/common.js'
import stardardList from '@mixins/tables/stardardList.js'

//modal
import invokeModal from '@mixins/modal/invokeModal.js'
// import BigPicModal from '@components/widgets/BigPicModal.vue'

// image
// import images from '@mixins/image.js'

// 引进vue的js
import js from './js/vip_water.js'

export default {
  mixins: [common, stardardList, invokeModal, js],
  data() {
    var today = [new Date(moment().format('YYYY-MM-DD 00:00:00')), new Date(moment().add(1, 'days').format('YYYY-MM-DD 00:00:00'))];
    return {
      total: 0,
      fixedCols: 4,
      paramName:'parkId',
      searchList: [
        { index: 0, isShow: false, type: 'datePicker', name: 'operateFromTo', text: '操作时间', propName: 'operateFrom,operateTo', value: today, style: { width: '360px' } },
        { index: 1, isShow: false, type: 'text', name: 'owner', text: '车主姓名', value: '' },
        { index: 2, isShow: false, type: 'text', name: 'tel', text: '车主电话', value: '' },
        { index: 3, isShow: false, type: 'text', name: 'plate', text: '车牌号', value: '' },
        {
          index: 4, isShow: false, type: 'select', name: 'waterType', text: '流水类型', value: '', options: [
            { name: '--全部--', value: '' },
            { name: '开通', value: '0' },
            { name: '续期', value: '1' },
            { name: '退款', value: '2' },
            { name: '暂停', value: '3' },
            { name: '暂停恢复', value: '4' },
            { name: '已恢复', value: '5' }
          ]
        },
        {
          index: 5, isShow: false, type: 'select', name: 'settlementType', text: '结算类型', value: '', options: [
            { name: '--全部--', value: '' },
            { name: '时间结算', value: '0' },
            { name: '储值结算', value: '1' },
            { name: '次数结算', value: '2' },
          ]
        },
        { index: 6, isShow: false, type: 'text', name: 'vipName', text: 'VIP别称', value: '' },
        {
          index: 7, isShow: false, type: 'select', name: 'payOrigin', text: '缴费来源', value: '', options: [
            { name: '--全部--', value: '' },
            { name: '未定义', value: '0' },
            { name: '出入口', value: '1' },
            { name: '中央缴费', value: '2' },
            { name: '自助缴费机', value: '3' },
            { name: '平板', value: '4' },
            { name: '移动POS机', value: '5' },
            { name: '移动APP', value: '6' },
            { name: '微信服务号', value: '7' },
            { name: '支付宝服务窗', value: '8' },
            { name: '线上支付', value: '9' },
            { name: '独立H5', value: '10' },
            { name: 'POMP', value: '11' },
            { name: 'VEMS', value: '12' },
            { name: 'AOMP', value: '13' },
            { name: '微信小程序', value: '14' },
            { name: '支付宝小程序', value: '15' },
          ]
        },
        {
          index: 8, isShow: false, type: 'select', name: 'payWay', text: '缴费方式', value: '', options: [
            { name: '--全部--', value: '' },
            { name: '未定义', value: '0' },
            { name: '现金', value: '1' },
            { name: '自发卡', value: '2' },
            { name: '次数', value: '3' },
            { name: '微信支付', value: '4' },
            { name: '支付宝支付', value: '5' },
            { name: '银联闪付', value: '6' },
            { name: '交通卡', value: '7' },
            { name: '免费', value: '8' },
            { name: '余额账户', value: '9' },
            { name: '银联接触卡', value: '10' },
            { name: '银联网络支付', value: '11' },
            { name: '第三方余额', value: '12' },
            { name: 'NFC', value: '13' },
            { name: '普通储蓄卡', value: '14' },
            { name: '信用卡', value: '15' },
            { name: '微信免密', value: '16' },
            { name: '支付宝免密', value: '17' },
            { name: '腾讯无感支付', value: '18' },
            { name: 'ETC', value: '19' },
            { name: '手动转账', value: '20' },
            { name: '微信无感支付', value: '21' },
            { name: '支付宝无感支付', value: '22' },
            { name: '银联无感支付', value: '23' },
          ]
        },
        { index: 9, isShow: false, type: 'text', name: 'operator', text: '操作员', value: '' },
        // {
        //   index: 10,
        //   isShow: false,
        //   initShow: sessionStorage.getItem("isShowOperator") == "false" ? false : true,
        //   type: "text",
        //   name: "operatorName",
        //   text: "运营商名称",
        //   value: ""
        // } 
      ],
      theadsInfo: [
        { index: 0, isShow: false, prop: 'reno', text: '序号', width: 68 },
        { index: 1, isShow: false, prop: 'customerName', text: '车主姓名', minWidth: 120 },
        { index: 2, isShow: false, prop: 'cellPhone', text: '手机号码', minWidth: 130 },
        { index: 3, isShow: false, prop: 'plateNum', text: '车牌号码', minWidth: 130 },
        { index: 4, isShow: false, prop: 'carportNum', text: '车位号', minWidth: 120 },
        { index: 5, isShow: false, prop: 'settleTypeStr', text: '结算类型', minWidth: 100 },
        { index: 6, isShow: false, prop: 'vipName', text: 'VIP别称', minWidth: 150 },
        { index: 7, isShow: false, prop: 'vipTime', text: '有效期', minWidth: 330 },
        { index: 8, isShow: false, prop: 'originPrice', text: '原价', minWidth: 100 },
        { index: 9, isShow: false, prop: 'discountPrice', text: '折扣价', minWidth: 100 },
        { index: 10, isShow: false, prop: 'operationTypeStr', text: '流水类型', minWidth: 100 },
        { index: 11, isShow: false, prop: 'payOriginStr', text: '缴费来源', minWidth: 130 },
        { index: 12, isShow: false, prop: 'payModeStr', text: '缴费方式', minWidth: 130 },
        { index: 13, isShow: false, prop: 'operator', text: '操作员', minWidth: 130 },
        { index: 14, isShow: false, prop: 'operateTime', text: '操作时间', minWidth: 180 },
        { index: 15, isShow: false, prop: 'refundPrice', text: '退款金额(元)', minWidth: 120 },
        { index: 16, isShow: false, prop: 'remark', text: '备注', minWidth: 180 },
      ],
      tbodysInfo: []
    }
  }
}
</script>

<style lang="less">
.config-modal {
  padding-bottom: 30px;
  .first-item {
    width: 240px;
  }
  .modal-body {
    // max-height: 500px;
    // min-height: 300px;
    overflow-y: scroll;
  }
  .select-park-textarea {
    display: block;
    margin-top: 10px;
    color: #333;
  }
  .el-textarea.is-disabled .el-textarea__inner {
    color: #333 !important;
  }
  .config-rule {
    width: 120px;
  }
}
</style>